import dayjs from 'dayjs'
import Schema from 'validate'
const repairInfo = new Schema({
  houseId: {
    type: String,
    required: true,
    message: '请选择报修房屋'
  },
  repairItemId: {
    type: String,
    required: true,
    message: '请选择保修项目'
  },
  mobile: {
    type: String,
    match: /^1[3-9]\d{9}$/,
    message: '手机不合法',
  },
  appointment: {
    type: String,
    required: true,
    message: '请选择预约时间'
  },
  description: {
    type: String,
    length: { min: 1, max: 200 },
    message: '请填写问题描述'
  },
  attachment: {
    type: Array,
    use: {
      listLengthValidate(v) {
        return !!v.length
      }
    },
    message: '请上传问题附件'
  }
},
  { strip: false } // 解决 验证对象后，数据丢失属性的问题！！
)
Page({
  data: {
    currentDate: new Date().getTime(),//获取当前时间戳
    houseLayerVisible: false,//选择保修房屋组件 显示隐藏
    repairLayerVisible: false, //选择维修组件 显示隐藏
    dateLayerVisible: false,// 预约日期组件 显示和隐藏
    //待维修房屋列表
    houseList: [],
    repairItem: [],
    // 问题附件
    attachment: [
      // { url: '/repair_pkg/static/uploads/attachment.jpg' },
      // { url: '/repair_pkg/static/uploads/attachment.jpg' },
    ],
    houseId: '',// 用户选择要维修的房屋的id
    houseInfo: '',// 用户选择要维修的房屋的名称
    repairItemId: '',// 用户选择的维修项目的id
    repairItemName: '',// 用户选择的维修项目的名称
    mobile: '',//手机号
    appointment: '',//用户预约的时间
    description: ''//问题描述
  },
  onLoad({ id }) {
    // 如果有id就是编辑
    if (!!id) {
      // 修改顶部标题
      wx.setNavigationBarTitle({
        title: '编辑报修信息',
      })
      this.setData({ id })
      this.getrepairinfo(id)
    } else {
      // 修改顶部标题
      wx.setNavigationBarTitle({
        title: '填写报修信息',
      })
    }
    this.getHouseList()

  },
  // 获取数据回显
  async getrepairinfo(id) {
    const res = await wx.http({
      url: `/repair/${id}`
    })
    const { status, ...data } = res.data
    this.setData(data)
  },

  // 获取我可保修房屋列表和维修项目列表
  async getHouseList() {
    // 获取我可保修房屋列表
    const res = await wx.http({
      url: '/house'
    })
    //获取维修项目列表
    const res2 = await wx.http({
      url: '/repairItem'
    })
    // 保存房屋列表
    this.setData({
      houseList: res.data,//保存我可保修房屋列表
      repairItem: res2.data,//保存维修项目列表
    })
  },

  // 设置 选择保修房屋组件 显示
  openHouseLayer() {
    this.setData({ houseLayerVisible: true })
  },
  // 设置 选择保修房屋组件 隐藏
  closeHouseLayer() {
    this.setData({ houseLayerVisible: false })
  },
  // 选择了要维修房屋
  onHouseSelect(ev) {
    this.setData({
      houseId: ev.detail.id,
      houseInfo: ev.detail.name,
    })
  },
  // 设置 选择维修项目组件 显示
  openRepairLayer() {
    this.setData({ repairLayerVisible: true })
  },
  // 设置 选择维修项目组件 隐藏
  closeRepairLayer() {
    this.setData({
      repairLayerVisible: false,
    })
  },
  // 选择的维修项目
  onrepairSelect(ev) {
    this.setData({
      repairItemId: ev.detail.id,
      repairItemName: ev.detail.name
    })
  },
  // 设置 预约日期组件 显示
  openDateLayer() {
    this.setData({ dateLayerVisible: true })
  },
  // 设置 预约日期组件 隐藏
  closeDateLayer() {
    this.setData({ dateLayerVisible: false })
  },
  // 选择了的日期
  onDateTimeConfirm(ev) {
    this.setData({
      appointment: dayjs(ev.detail).format('YYYY-MM-DD'),
      dateLayerVisible: false
    })
    // this.setData({ dateLayerVisible: false })
  },
  // 上传图片
  onAfterRead(ev) {
    const { thumb } = ev.detail.file
    // 上传图片
    wx.uploadFile({
      filePath: thumb,//文件临时地址
      name: 'file',// 获取文件的key 给后端去获取
      url: wx.http.baseURL + '/upload',
      header: {
        Authorization: `Bearer ${getApp().token}`// 请求头 token
      },
      success: (res) => {
        // 转换返回的字符串信息
        const data = JSON.parse(res.data)
        // 提取选择已经上传的图片
        const { attachment } = this.data
        // 把新增的图片添加进去
        attachment.push(data.data)
        // 保存到data
        this.setData({
          attachment
        })
      },
      fail: (err) => {
        console.log(err);
      }
    })
  },
  // 删除图片
  onDeletefn(ev) {
    wx.showModal({
      title: '提示',
      content: '点击确定删除',
      success: ({ confirm }) => {
        if (confirm) {
          const { index } = ev.detail//要删除图片的下标
          const { attachment } = this.data//获取所有图片
          attachment.splice(index, 1)//删除所选图片
          // 重新保存图片
          this.setData({
            attachment
          })
        }
      }
    })
  },
  // 提交申请
  async onSubmit() {
    const { houseId, repairItemId, mobile, appointment, description, attachment, id } = this.data
    const params = { houseId, repairItemId, mobile, appointment, description, attachment, id }
    // 如果id没定义就删除id
    if (!!params.id) {
      delete params.repairId
    }
    // 表单验证
    const errors = repairInfo.validate(params)
    if (errors.length !== 0) {
      return wx.utils.toast(errors[0].message)
    }
    // 发送保修请求
    const res = await wx.http({
      url: '/repair',
      method: 'post',
      data: params
    })
    console.log(res);
    // 弹窗提示
    wx.showToast({
      title: '提交成功'
    })
    // 跳转
    setTimeout(() => {
      wx.reLaunch({
        url: '/repair_pkg/pages/list/index',
      })
    }, 1000);
  },
})
